<template>
    <el-menu :default-openeds="['1', '3']" style="height: 100%;"
             background-color="rgb(48,65,86)"
             text-color="#fff"
             active-text-color="#ffd04b"
             :collapse-transition="false"
             :collapse="isCollapse">
        <div style="line-height: 60px;height: 60px;text-align: center;">
            <img src="../assets/logo.png" style="width: 20px;position: relative;top:5px;"
                 alt="">
            <b style="color:#fff;margin-left: 5px;" v-show="!isCollapse">后台管理系统</b>
        </div>
        <el-submenu index="1">
            <template slot="title">
                <i class="el-icon-location"></i>
                <span>导航一</span>
            </template>
            <el-menu-item-group>
                <template slot="title">分组一</template>
                <el-menu-item index="1-1">选项1</el-menu-item>
                <el-menu-item index="1-2">选项2</el-menu-item>
            </el-menu-item-group>
            <el-menu-item-group title="分组2">
                <el-menu-item index="1-3">选项3</el-menu-item>
            </el-menu-item-group>
            <el-submenu index="DemoUpload">
                <template slot="title">选项4</template>
                <el-menu-item index="1-4-1">选项1</el-menu-item>
            </el-submenu>
        </el-submenu>
    </el-menu>
</template>

<script>
    export default {
        name: "ManageAside",
        props: {
            isCollapse: Boolean,
        },
        data(){
            return{
                sideWidth:200,
            }
        }
    }

</script>

<style scoped>

</style>
